@charset "utf-8";
/* CSS Document */

body{overflow-x:hidden;}

.wrapper-box{ width:1400px; margin:0 auto; box-sizing:border-box;}

.flex {
    display: flex;
    flex-wrap: wrap;
}

.Istop{ position:fixed; z-index:99; width:100%; top:0; left:0; right:0; margin:0 auto;}

.topbar{ background:#fff url(../img/topbar.jpg) no-repeat; padding:12px 0;}
.topbar .vx{ float:left; width:10%; overflow:hidden; text-align:center;}
.topbar .vx img{ width:120px;}
.topbar .tel{
	float: right;
    font-weight: bold;
    color: #111;
    font-size: 24px;
    padding-top: 20px;
    width: 20%;
    text-align: right;
}
.topbar .tel b{ font-family:Arial, Helvetica, sans-serif; font-size:34px;}

.nav {
	padding: 0px 40px;
	background: #125faf;
}
.logo {
	float:left;
	width:45%;
	padding-top:20px;
}
.menuBox ul li a{ font-size:18px;}
.a_menu {
	display: none;
	float: right;
}
.a_menu img { height: 30px; }


/*banner*/
.bannerslide01 {
	height: 650px;
	width: 100%;
	position: relative;
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}
.bannerslide01 .swiper-slide {
	background-position: center;
	background-size: cover;
	height: 650px;
}
.bannerslide01 .swiper-slide .btn{
	position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}
.bannerslide01 .swiper-slide .btn a{
	width: 100%;
    background: #da222a;
    color: #fff;
    padding: 10px 20px;
    text-align: center;
    opacity: 0;
    height: 650px;
    justify-content: center;
    align-items: center;
    display: flex;
    font-size: 60px;
    box-sizing: border-box;
}
.bannerslide01 .swiper-button-prev {
	background: url(../images/arrows.png) no-repeat left top;
	position: absolute;
	left: 10px;
	top: 50%;
	margin-top: -15px;
	width: 40px;
	height: 60px;
	z-index: 999;
	outline: none;
}
.bannerslide01 .swiper-button-next {
	background: url(../images/arrows.png) no-repeat right bottom;
	position: absolute;
	right: 10px;
	top: 50%;
	margin-top: -15px;
	width: 40px;
	height: 60px;
	z-index: 999;
	outline: none;
}
.swiper-button-prev:after, .swiper-button-next:after { content: normal; }



.homebox1{ padding:70px 0; width:1600px; margin:0 auto;}
.homebox1 ul li{ position:relative; float:left; width:33%; box-sizing:border-box; padding:20px 50px; font-size:14px;}
.homebox1 ul li:after{ content:""; position:absolute; right:0; top:20px; width:1px; height:200px; background-color:#ccc;}
.homebox1 ul li:last-child:after{ width:0;}
.homebox1 ul li h2{ font-size:24px; color:#111; margin-bottom:20px;}
.homebox1 ul li:first-child{ font-size:16px; color:#111; font-weight:bold;}
.homebox1 ul li .aa{
	background: #31b2eb;
    padding: 10px 20px;
    color: #fff;
    font-size: 14px;
	display:inline-block;
	margin-top:20px;
}


.hometit{ text-align:center; line-height:160%; margin-bottom:40px;}
.hometit .tt{ font-size:30px; color:#111; font-weight:bold; margin-bottom:20px;}
.hometit .ww{ font-size:14px; color:#111;}

.homebox2{ background:#f2f6fa; padding:70px 0;}
.homebox2 .picbox{ padding:0 20px;}
.homebox2 .picbox .item { float: left; width: 23.5%; margin-right: 2%; background: #fff; -webkit-box-shadow: 2px 2px 30px rgba(0,0,0,0.1); box-shadow: 2px 2px 30px rgba(0,0,0,0.1); box-sizing: border-box; -webkit-transition: all .2s; transition: all .2s; margin-bottom:2%;}
.homebox2 .picbox .item:hover { -webkit-transform: translateY(-5px); transform: translateY(-5px); }
.homebox2 .picbox .item:nth-child(4n) { margin-right: 0; }
.homebox2 .picbox .item .img img { display: block; width: 100%; }
.homebox2 .picbox .item .box { padding: 40px 30px; }
.homebox2 .picbox .item .box .name { font-size: 20px; line-height: 32px; margin-bottom: 15px; color: #666; }
.homebox2 .picbox .item .box .text { font-size: 14px; line-height: 22px; height: 44px; overflow: hidden; margin-bottom: 25px; color: #666; }
.homebox2 .picbox .item .box .btnn { position: relative; }
.homebox2 .picbox .item .box .btnn:after { content: ''; width: 36px; height: 3px; background: #e70000; position: absolute; left: 0; bottom: -10px; }
.homebox2 .picbox .item .box .btnn a { font-size: 12px; line-height: 20px; color: #666; text-decoration: none; }
.homebox2 .picbox .item .box .btnn a:hover { color: #ea0000; }


.homebox3{ padding:70px 20px; margin:0 auto;}
.homebox3 .subtit { text-align: center; margin-bottom: 30px; }
.homebox3 .subtit a { font-size: 14px; color: #333; display: inline-block; line-height: 42px; border: 1px solid transparent; text-decoration: none; margin: 0 10px; border-radius: 30px;  border-color: #111; padding:0 20px;}
.homebox3 .subtit a:hover {
	color: #ffffff;
    background: #3d83df;
    border-color: #3d83df;
}
.homebox3 .hb03list { padding: 10px 0 90px; position:relative; }
.homebox3 .hb03list .swiper-slide { background: #fff; -webkit-box-shadow: 2px 2px 30px rgba(0,0,0,0.1); box-shadow: 2px 2px 30px rgba(0,0,0,0.1); box-sizing: border-box; -webkit-transition: all .2s; transition: all .2s; }
.homebox3 .hb03list .swiper-slide:hover { -webkit-transform: translateY(-5px); transform: translateY(-5px); }
.homebox3 .hb03list .swiper-slide .img img { display: block; width: 100%; }
.homebox3 .hb03list .swiper-slide .box { padding: 40px 30px; }
.homebox3 .hb03list .swiper-slide .box .nam { line-height: 30px; height: 30px; margin-bottom: 10px; overflow: hidden; }
.homebox3 .hb03list .swiper-slide .box .nam a { font-weight: bold; font-size: 18px; color: #333; }
.homebox3 .hb03list .swiper-slide .box .txt { font-size: 14px; color: #666; line-height: 20px; height: 60px; overflow: hidden; margin-bottom: 20px; }
.homebox3 .hb03list .swiper-slide .box .btn { position: relative; }
.homebox3 .hb03list .swiper-slide .box .btn:after { content: ''; width: 36px; height: 3px; background: #e70000; position: absolute; left: 0; bottom: -10px; }
.homebox3 .hb03list .swiper-slide .box .btn a { font-size: 14px; line-height: 20px; color: #666; text-decoration: none; }
.homebox3 .hb03list .swiper-slide .box .btn a:hover { color: #ea0000; }
.homebox3 .hb03list .swiper-pagination { font-size: 12px; font-family: arial; line-height: 50px; }
.homebox3 .hb03list .swiper-pagination .swiper-pagination-current { margin: 0 10px; }
.homebox3 .hb03list .swiper-pagination .swiper-pagination-total { margin: 0 10px; }
.homebox3 .hb03list .swiper-button-prev { margin-top: 0; height: 50px; width: 20px; top: auto; bottom: 10px; left: 50%; margin-left: -60px; background: url(../img/leftarr.png) no-repeat center; }
.homebox3 .hb03list .swiper-button-next { margin-top: 0; height: 50px; width: 20px; top: auto; bottom: 10px; left: 50%; margin-left: 40px; background: url(../img/rightarr.png) no-repeat center; }


.homebox4{ padding:70px 0; background:#f1f6fd;}
.homebox4 .list { margin-bottom: 40px; }
.homebox4 .list .item { float: left; width: 49%; margin-right: 2%; background: #fff; -webkit-box-shadow: 2px 2px 30px rgba(0,0,0,0.1); box-shadow: 2px 2px 30px rgba(0,0,0,0.1); box-sizing: border-box; padding: 60px; -webkit-transition: all .2s; transition: all .2s; }
.homebox4 .list .item:hover { -webkit-transform: translateY(-5px); transform: translateY(-5px); }
.homebox4 .list .item:nth-child(2n) { margin-right: 0; }
.homebox4 .list .item .time { font-size: 12px; line-height: 20px; margin-bottom: 10px; color: #999; }
.homebox4 .list .item .time .split { margin: 0 10px; color: #ccc; }
.homebox4 .list .item .name { font-size: 18px; line-height: 28px; margin-bottom: 25px; height: 28px; overflow: hidden; }
.homebox4 .list .item .name a { color: #111; font-size:20px;}
.homebox4 .list .item .name a:hover { color: #ea0000; }
.homebox4 .list .item .text { color: #777; font-size: 14px; line-height: 24px; height: 72px; overflow: hidden; margin-bottom: 16px; }
.homebox4 .list .item .link { overflow: hidden; margin-bottom: -12px; }
.homebox4 .list .item .link a { width: 24px; height: 24px; display: block; background: url(../img/hb01img01.png) no-repeat center; float: left; }
.homebox4 .list .item .link a.l02 { float: right; background-image: url(../img/hb01img02.png); }

.commonbtn { text-align: center; }
.commonbtn a { display: inline-block; line-height: 46px; background: #ea0000; border-radius: 30px; color: #fff; padding: 0 30px; font-size: 13px; text-decoration: none; -webkit-transition: all .2s; transition: all .2s; }
.commonbtn a:hover { opacity: .8; padding: 0 60px; }


.footer{ background:#383843;}
.footer .foot{ padding:70px 0;}
.footer dl{ float:left; width:12%;}
.footer dl.pp{ width:20%;}
.footer dl.cc{ width:30%;}
.footer dl dt{
	font-size: 15px;
    padding-bottom: 10px;
    color: #ccc;
}
.footer dl dd,.footer dl dd a{
	padding-top: 5px;
    line-height: 180%;
    color: #fff;
	font-size:14px;
}
.footer .copy{ border-top:1px solid #636970; color:#fff; font-size:13px; padding:20px 0;}


.honorlist{}
.honorlist .item{ float:left; border-top:1px solid #ccc; border-left:1px solid #ccc; width:25%; box-sizing:border-box; padding:20px;}
.honorlist .item:nth-child(4n){ border-right:1px solid #ccc; }
.honorlist .item:nth-last-of-type(-n+4){
    border-bottom: 1px solid #ccc;;
}
.honorlist .item .pic{
	width: 210px;
    height: 280px;
    margin: auto;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.honorlist .item .pic img{ width:100%; display:block;}
.honorlist .item .name{ text-align:center; font-size:16px; color:#111; margin-top:10px;}


.caselist{ overflow:hidden; margin-top:20px;}
.caselist li{
	float: left;
    width: 30%;
    text-align: center;
    font-size: 18px;
    margin: 1%;
    font-weight: bold;
	position:relative;
}
.caselist li .pic{ border-radius: 10px; border:2px solid #c33;}
.caselist li img{ display:block; width:100%;border-radius: 10px;}
.caselist li p{
	background: rgb(0 0 0 / 40%);
    position: absolute;
    width: 98%;
    bottom: 1%;
    border-radius: 0 0 10px 10px;
    left: 1%;
    color: #fff;
    height: 30px;
}

/*产品内页*/
.small-box { width: 100%; height: 450px; border: 1px solid #e5e5e5; position: relative; background: #FFF; overflow: hidden }
.flex-jc-ai-c { display: flex; flex-wrap: wrap; justify-content: center; align-items: center }
.pdshow-l { width: 450px }
.preview-container { position: relative; width: 100% }
.preview-container .small-box img { max-width: 100%; max-height: 100%; display: block }
.preview-container .small-box .hover { position: absolute; width: 150px; height: 150px; background-color: hsla(0,0%,80%,.6); border: 1px solid #EEE; display: none; cursor: move }
.preview-container .thumbnail-box { margin-top: 30px; position: relative; width: 100% }
.preview-container .thumbnail-box .btn { position: absolute; top: 50%; width: 22px; height: 22px; margin-top: -11px; color: #7aca35 }
.preview-container .thumbnail-box .btn i { font-size: 26px; font-weight: 600 }
.preview-container .thumbnail-box .btn-prev { left: 0 }
.preview-container .thumbnail-box .btn-next { right: 0 }
.preview-container .thumbnail-box .btn_next_disabled, .preview-container .thumbnail-box .btn_prev_disabled { opacity: .5; cursor: not-allowed }
.preview-container .thumbnail-box .list { overflow: hidden; width: calc(100% - 72px); margin: 0 auto; position: relative }
.preview-container .thumbnail-box .list .swiper-pagination { display: none }
.preview-container .thumbnail-box .list ul .item { width: 110px; height: 110px; display: flex; justify-content: center; align-items: center; margin: 0 6px; border: 1px solid #e5e5e5; font-size: 0; cursor: pointer; overflow: hidden }
.preview-container .thumbnail-box .list ul .item img { width: 99% }
.preview-container .thumbnail-box .list ul .item-cur { border-color: #a2a2a2; }
.preview-container .thumbnail-box .list .banner-page { display: none; justify-content: center; align-items: center; position: absolute; width: 13.3333333333vw; border-radius: 5.3333333333vw; background: #7aca35; bottom: 1.3333333333vw; right: 1.3333333333vw; z-index: 999 }
.preview-container .thumbnail-box .list .banner-page span { color: #FFF; font-size: 4vw; margin: 0 2px }
.preview-container .big-box { display: none; overflow: hidden; top: 0; left: calc(100% - 1px); border: 1px solid #e5e5e5; position: absolute; width: 100%; height: 450px; background: #FFF; z-index: 20 }
.preview-container .big-box img { display: block; max-width: none; max-height: none; width: 250% }
.pdshow-r { width: calc(100% - 450px); padding: 10px 0 0 30px; color: #2a2a2a; box-sizing:border-box; }
.pdshow-r h1 { font-size: 24px;  line-height: 1.3 }
.pdshow-r-text { line-height: 1.6; padding: 3% 0 6%; font-size: 16px; border-bottom: 1px solid #e5e5e5; margin-bottom: 6% }
.pdshow-r-text strong,.pdshow-r-text b{ color:#d9222a;}
.pdshow-r-btn { margin-top: 6%; display: flex; justify-content: space-between }
.pdshow-r-btn>a, .pdshow-r-btn>div { width: 48%; height: 42px; border: 1px solid #7aca35; color: #7aca35; display: flex; justify-content: space-between; align-items: center; padding: 0 20px; margin-bottom: 10px; transition: all .2s ease-in-out; text-transform: uppercase }
.pdshow-r-btn>a:hover, .pdshow-r-btn>div:hover { background-color: #7aca35; color: #FFF }
.pdshow-r-btn>div a { display: flex; align-items: center; width: 100%; height: 100% }

.prolist-content{ padding:50px 0 0 0; width:100%; box-sizing:border-box;}
.prolist-content .tt{
	border-bottom: solid 1px #ddd;
    height: 40px;
    line-height: 40px;
	margin-bottom:20px;
}
.prolist-content .tt h4{
	border-bottom: solid 2px #d9222a;
    float: left;
    margin: 0;
    line-height: 38px;
    position: relative;
	font-size:24px;
}
.share-btn-list{
	background: #c9131f;
    color: #fff;
    border-radius: 30px;
    padding: 0 30px;
    height: 45px;
    line-height: 45px;
    font-size: 16px;
    display: inline-block;
}

/*产品分类*/
.pdshow{ float:right; width:calc(100% - 330px);}
.proshow{ margin-top:30px;}
.mark-l{
	float: left;
    width: 300px;
    color: #2a2a2a;
	margin-right:30px;
}
.mark-l-tit {
    background: #4a4a4a;
    color: #FFF;
    padding: 10px 20px;
    font-size: 24px;
    text-transform: capitalize;
	border-radius: 30px 0 30px 0;
}
.mark-l-menu {
    margin-bottom: 30px;
}
.mark-l-menu>li {
    position: relative;
    border-bottom: 1px solid #e5e5e5;
    padding-right: 20px;
}
.mark-l-menu a {
    display: block;
    padding: 10px 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
	font-size: 16px;
	font-weight:bold;
	color:#2a2a2a;
}
.mark-l-menu a:hover{ text-decoration:none; color:#4a4a4a;}


.aar{ overflow:hidden; }
.aar li{ float:left;position:relative;}
.aar li:after{
	content: url(../img/aar.png);
    position: absolute;
    right: -30px;
    z-index: 999;
    top: 35%;
}
.aar li:nth-child(4):after,.aar li:nth-child(5):after,.aar li:nth-child(6):after{ display:none;}
.n_nav{ display:none;}


@media (max-width: 1440px) {
	.homebox1{ width:100%; box-sizing:border-box; padding:70px 20px;}
}

@media (max-width: 1024px) {
	.wrapper-box{ width:100%; padding:0 20px;}
	.homebox3 .hb03list{ width:100%; overflow:hidden;}
	.homebox4 .list .item{ width:100%; margin-bottom:2%;}
	.footer dl{ display:none;}
	.footer dl.cc{ display:block; width:100%;}
	.bannerslide01,.bannerslide01 .swiper-slide{ height:480px;}
	
	.logo,.topbar .vx,.topbar .tel{ width:auto;}
	.topbar .vx{ padding-left:30px;}
	
	.product_content li{ width:48%; margin-right:1%;}
	.product_content li:nth-child(3n){ margin-right:1%;}
	
	
	.pdshow{ width:100%;}
	.u_np{ width:100%;}
}

@media (max-width: 768px) {
	.menuBox { display: none; }
	.a_menu {
		display: block;
		margin-top: 40px;
		position: absolute;
		top: 0;
		right: 30px
	 }
	 .logo{ padding-top:0; width:70%;}
	 .logo img{ width:100%;}
	
	.topbar .vx, .topbar .tel,.nav{ display:none;}
	
	.n_nav{ display:block;}
	.mark-l{ display:none;}
	
	.product_content{ width:100%;}
	
	.bannerslide01,.bannerslide01 .swiper-slide{ height:400px;}
	.homebox1 ul li{ width:100%;}
	.homebox1 ul li:after{ display:none;}
	.homebox2 .picbox .item{ width:49%;}
	.homebox2 .picbox .item:nth-child(2n){ margin-right:0;}
	.homebox3 .subtit a{ margin-bottom:10px;}
	
	.honorlist .item .pic{ width:100%; height:210px;}
	.pro_nav li{ width:24%; margin-bottom:1%;}
	.pro_nav li:nth-child(6n){ margin-right:1%;}
}

@media (max-width: 425px) {
	.bannerslide01,.bannerslide01 .swiper-slide{ height:170px;}
	.bannerslide01 .swiper-button-next,.bannerslide01 .swiper-button-prev{ display:none;}
	.homebox1{ padding:40px 20px;}
	.homebox1 ul li{ padding:20px 0;}
	
	.honorlist .item{ width:50%;}
	.honorlist .item:nth-child(2n){border-right: 1px solid #ccc;}
	.honorlist .item:nth-last-of-type(-n+4){ border-bottom: none;}
	.honorlist .item:nth-last-of-type(-n+2){ border-bottom: 1px solid #ccc;}
	
	.pro_nav li{ width:49%;}
	.a_menu{ margin-top:20px;}
	.homebox3 .subtit a {
		width: 47%;
		box-sizing: border-box;
		padding: 0;
		float: left;
		margin: 0 5px;
		margin-bottom:5px;
	}
	.pdshow-l, .pdshow-r {
		width: 100%;
	}
	.preview-container .thumbnail-box .list { width: 100% }
	.preview-container .thumbnail-box .list ul .item-cur { border: none }
	.preview-container .thumbnail-box .list ul .item { width: 100%; height: auto; border: none }
	.preview-container .thumbnail-box .list .banner-page { display: flex }
	.pdshow-r { padding-left: 0 }
	.u_np{ flex-wrap:wrap;}
	.u_np li:first-child, .u_np li:last-child{ width:100% !important;}
	.u_np li:nth-child(2){ width:100% !important; border:1px solid #ccc; border-top:none; border-bottom:none;}
	.u_np li:last-child{ text-align:left;}

}